<template>
  <view class="main">
    <view class="tools">
      <view @click="goTools(item.url)" class="tools_item flex_col_center" v-for="item, index in tools" :key="index">
        <image class="icon" :src="item.icon"></image>
        <text class="name">{{ item.name }}</text>
      </view>
    </view>
  </view>
</template>
<script type="text/javascript" src="plus-confusion://../tools/index"></script>

<style scoped lang="scss">
.tools {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  .tools_item {
    margin-top: 40rpx;
    text-align: center;

    .icon {
      display: block;
      width: 80rpx;
      height: 80rpx;
      margin-bottom: 20rpx;
    }

    .name {
      margin-top: 20rpx;
      font-size: 28rpx;
    }
  }
}
</style>